<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html">
        <h:head>
            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>.::AsPerA::. Asignación de Permisos de Aprendices</title>
                <link rel="shortcut icon" href="favicon.ico"/>
            </f:facet>
        </h:head>

        <h:body>            
            <div>
                <h:graphicImage url="/aspera/images/aspera.jpg" width="100%" height="100%" alt="LogoAspera"  style="vertical-align: top;"/> 
            </div>

            <p:panel>
                <p:panelGrid> 
                    <p:row>
                        <p:column style="vertical-align: top;">
                            <h:form>
                                <p:menu>
                                    <p:submenu label="Menú">                                
                                        <p:menuitem value="Inicio" url="/faces/aspera/indexCoordinador.xhtml" />
                                        <p:menuitem value="Coordinadores" url="/faces/aspera/GestionCoordinador.xhtml" />
                                        <p:menuitem value="Permisos" url="/faces/aspera/gestionPermisos.xhtml" />
                                        <p:menuitem value="Instructores" url="/faces/aspera/gestionInstructores.xhtml" />
                                        <p:menuitem value="Asignar Fichas" url="/faces/aspera/asignarFichas.xhtml" />
                                        <p:menuitem value="Programas" url="/faces/aspera/gestionProgramas.xhtml" />
                                        <p:menuitem value="Fichas" url="/faces/aspera/gestionFichas.xhtml" />     
                                        <p:menuitem value="Aprendices" url="/faces/aspera/gestionAprendices.xhtml" />
                                        <p:menuitem value="Reportes" url="/faces/aspera/Reportes.xhtml" />
                                        <p:menuitem value="Cambio Contraseña" url="/faces/aspera/CambiaPasswordCoord.xhtml" />
                                        <p:menuitem value="Cerrar Sesión" actionListener="#{usuariosVista.cerrarSesion_action}" />
                                    </p:submenu>                    
                                </p:menu>
                            </h:form>
                        </p:column>
                        <p:column>         

                            <h:form id="formulario">                       
                                <p:panel id="panel" header="Reportes">
                                    <p:ajaxStatus onstart="PF('statusDialog').show();" oncomplete="PF('statusDialog').hide();"/>
                                    <f:facet name="actions">
                                        <p:commandLink onclick="PF('helpDialog').show();" styleClass="ui-panel-titlebar-icon ui-corner-all ui-state-default"><h:outputText styleClass="ui-icon ui-icon-help" /></p:commandLink>
                                    </f:facet>
                                    <p:messages id="mensajes" showDetail="true" />  
                                    <p:panel header="Reporte de Todos los Permisos Aprobados en un Rango de Fechas">
                                        <p:panelGrid id="pnlReporTotal" columns="2">                                       
                                            <h:outputText value="Fecha Inicio:"/>
                                            <p:calendar  id="calFechaIni" value="#{reporteVista.fechaIni}" pattern="yyyy-MM-dd" />                                    
                                            <h:outputText value="Fecha Final:"/>
                                            <p:calendar  id="calFechaFin" value="#{reporteVista.fechaFin}" pattern="yyyy-MM-dd" />

                                            <f:facet name="footer"> 
                                                <div align="center"> 
                                                    <p:commandButton id="btnGenerar" value="Generar" binding="#{reporteVista.btnGenerar}" action="#{reporteVista.generarReporte_action}" update="panel"/>
                                                    <p:commandButton id="btnLimpiar" value="Limpiar" binding="#{reporteVista.btnLimpiar}" action="#{reporteVista.limpiar_action}"  update="pnlReporTotal"/>
                                                </div>
                                            </f:facet>
                                        </p:panelGrid>                                
                                    </p:panel> 
                                    <br />
                                    <p:panel header="Reporte Individual de Permisos de un Aprendiz">
                                        <p:panelGrid id="pnlReporAprendiz" columns="2">
                                            <h:outputText value="Documento:"/>   
                                            <p:inputText id="txtDocumento" binding="#{reporteVista.txtDocumento}" 
                                                         title="Digite El Documento del Aprendiz">
                                                <p:tooltip for="txtDocumento" value="Digite El Documento del Aprendiz y Presione TAB" showEffect="slide" hideEffect="slide" />
                                                <!-- ajax para el listener del campo -->
                                                <p:ajax listener="#{reporteVista.txtDocumento_listener}" update="pnlReporAprendiz" />
                                            </p:inputText>   
                                            <h:outputText value="Nombre:"/>
                                            <p:inputText id="txtNombre" binding="#{reporteVista.txtNombre}" readonly="true" />

                                            <f:facet name="footer"> 
                                                <div align="center"> 
                                                    <p:commandButton id="btnGenerar2" value="Generar" binding="#{reporteVista.btnGenerar2}" action="#{reporteVista.generarReporte2_action}" update="panel" />
                                                    <p:commandButton id="btnLimpiar2" value="Limpiar" binding="#{reporteVista.btnLimpiar2}" action="#{reporteVista.limpiar2_action}" update="pnlReporAprendiz"/>
                                                </div>
                                            </f:facet>
                                        </p:panelGrid>                                
                                    </p:panel>                             
                                    <br />
                                    <p:panel header="Reporte Aprendices con Mayor Cantidad de Permisos Aprobados">
                                        <p:commandButton id="btnGenerar3" value="Generar" binding="#{reporteVista.btnGenerar3}" action="#{reporteVista.generarReporte3_action}" update="panel"/>
                                    </p:panel>  
                                </p:panel>
                                <!-- dialogo de ayuda -->
                                <p:dialog id="modalDialog" header="Ayuda" widgetVar="helpDialog" showEffect="fade" hideEffect="bounce" modal="true" dynamic="true">  
                                    <p align="justify">                       
                                        En esta página usted podrá:<br/><br/>
                                        <b>-Generar Reporte de Todos los Permisos Aprobados en un Rango de Fechas:</b> Para generar el reporte debe ingresar un rango de fechas 
                                        para filtrar los permisos aprobados entre esas fechas y luego dar clic en el botón Generar.
                                        <br/><br/>
                                        <b>-Generar Reporte Individual de Permisos de un Aprendiz:</b> el coordinador debe digitar el documento del aprendiz y presionar la 
                                        tecla TAB(Tabulación) o Enter. ASPERA verificará que el aprendiz exista con ese mismo documento. Si existe cargará su nombre completo. Luego
                                        de clic en Generar para ver el reporte.
                                        <br/><br/>
                                        <b>-Generar Reporte Aprendices con Mayor Cantidad de Permisos Aprobados:</b> solo debe dar clic en el botón Generar para ver el reporte
                                        consolidado.
                                        <br/><br/>
                                        <u>Nota:</u> Todas las opciones de ésta página solo están disponibles para usuarios de tipo Coordinador.
                                        <br/>             
                                    </p>
                                </p:dialog>

                                <p:dialog modal="true" widgetVar="statusDialog" header="Cargando..."   
                                          draggable="false" closable="false">  
                                    <p:graphicImage value="/aspera/images/ajaxLoadingBar.gif" />  
                                </p:dialog>
                            </h:form> 
                        </p:column>
                    </p:row>
                </p:panelGrid>
            </p:panel> 
            <div>
                <h:graphicImage url="/aspera/images/asperaPie.jpg" width="100%" height="100%" alt="LogoAspera"  style="vertical-align: bottom;"/>
            </div>
        </h:body>
    </f:view>
</html>

